.view-root {
	width: 100%;
	height: 100vh;

	.title-bg-wrap {
		width: 100%;
		height: 248rpx;
		background: linear-gradient(270deg, #689BD2 0%, #92D9F6 100%);
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		box-sizing: border-box;
		z-index: -1;

		>image {
			bottom: 0;
			right: 180rpx;
			width: 192rpx;
			height: 180rpx;
			position: absolute;
		}
	}

	.empty-view {
		width: 100%;
		height: calc(100% - 248rpx);
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		box-sizing: border-box;
		z-index: -1;
	}

	.content-root {
		width: 100%;
		height: 100vh;
		display: flex;
		flex-direction: column;

		.title-wrap {
			display: flex;
			padding: 38rpx 60rpx;
			align-items: flex-end;
			justify-content: space-between;

			.available-notice-wrap {
				display: flex;
				flex-direction: column;
				align-items: center;

				.available-amount {
					font-size: 48rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #FFFFFF;
				}

				.available-notice {
					font-size: 30rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
					margin-top: 2rpx;
				}
			}

			.withdraw-record-btn {
				width: 140rpx;
				height: 56rpx;
				background: #FFFFFF;
				border-radius: 28rpx;
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #6E99C7;
				line-height: 56rpx;
				margin-bottom: 6rpx;
				text-align: center;
			}

			.withdraw-btn {
				width: 140rpx;
				height: 56rpx;
				background: #FFFFFF;
				border-radius: 28rpx;
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #FF9660;
				line-height: 56rpx;
				margin-bottom: 6rpx;
				text-align: center;
			}
		}

		.stats-panel {
			height: 140rpx;
			background: #FFFFFF;
			border-radius: 24rpx;
			margin: 0 24rpx;
			display: flex;

			.stats-wrap {
				flex: 1;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;

				.stats-title {
					font-size: 24rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #6B6970;
					margin-bottom: 16rpx;
				}

				.stats-data {
					font-size: 30rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #222222;
				}
			}
		}

		.filter-panel {
			display: flex;
			align-items: center;
			justify-content: space-between;
			height: 88rpx;

			.time_choose {
				display: flex;
				font-size: 28rpx;
				color: #6b6970;
				margin-left: 24rpx;
				align-items: center;

				>image {
					width: 20rpx;
					height: 12rpx;
					margin-left: 14rpx;
				}
			}

			.tab-wrap {
				width: 360rpx;
			}
		}

		.list-scroll {
			height: calc(100% - 410rpx);
			flex: 1;

			.user-card {
				margin: 24rpx 24rpx 0;
				background-color: white;
				padding: 24rpx;
				border-radius: 24rpx;
				display: flex;
				align-items: center;

				.content-wrap {
					display: flex;
					flex-direction: column;
					height: 92rpx;
					margin-left: 24rpx;
					justify-content: space-between;

					.user-name {
						font-size: 32rpx;
						font-family: PingFangSC-Semibold, PingFang SC;
						font-weight: 600;
						color: #333333;
					}

					.register-time {
						font-size: 24rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #B0B2B1;
					}
				}

				>image {
					width: 92rpx;
					height: 92rpx;
					border-radius: 46rpx;
				}


			}

			.user-card_2 {
				margin: 24rpx 24rpx 0;
				background-color: white;
				padding: 24rpx;
				border-radius: 24rpx;
				align-items: center;

				.tatel {
					display: flex;
					justify-content: space-between;
					padding-bottom: 24rpx;
					border-bottom: solid #E5E5E5 2rpx;

					>view {
						font-size: 24rpx;
						font-weight: 400;
					}

					>view:nth-child(1) {

						color: #B0B2B1;
					}

				}

				.image_txt-wrap {
					display: flex;
					margin-top: 20rpx;

					.txt-content {
						margin-left: 24rpx;
						flex: 1;
						display: flex;
						flex-direction: column;
						justify-content: space-between;

						>view:nth-child(1) {
							font-weight: 600;
							color: #333333;
							font-size: 32rpx;
						}

						>view:nth-child(2) {
							font-weight: 400;
							color: #B0B2B1;
							font-size: 24rpx;
						}
					}

					.txt-right {
						display: flex;
						flex-direction: column;
						justify-content: space-between;
						text-align: right;

						>view:nth-child(1) {
							font-size: 32rpx;
							font-weight: 600;
							color: #222222;
						}

						>view:nth-child(2) {
							font-size: 24rpx;
							font-weight: 400;
							color: #B0B2B1;

							>span {
								color: #FC4E4C;
							}
						}
					}
				}

				image {
					width: 92rpx;
					height: 92rpx;
					border-radius: 46rpx;
				}
			}
		}
	}

}